<template>
  <!-- 树状列表组件 -->
  <div style="width:100%;height:100%;">
    <el-tree
      ref="catetreeone"
      :data="treedata"
      :expand-on-click-node="false"
      default-expand-all
      :highlight-current="true"
      :props="treePropstype"
      @node-click="handleSelectionChange"
    />
  </div>
  <!-- show-checkbox -->
</template>
<script>
import nowpagereq from "@/api/basic-info-manage/device-allocation-data.js";
export default {
  data() {
    return {
      treePropstype: {
        children: "children",
        label: "deviceName"
      },
      treedata: [],
      deviceList: []
    };
  },
  mounted() {
    this.gettreelist();
    // setTimeout(() => {
    //   this.handleSelectionChange(this.treedata[0])
    // }, 1000);
  },
  methods: {
    handleSelectionChange(e) {
      this.$emit("treeselectvalue", e);
    },
    // 获取树状数据
    gettreelist() {
      nowpagereq.dataItemlist().then(res => {
        let data = res.data;
        this.deviceList = data;
        this.changetreedata();
      });
    },
    // 处理树状数据
    changetreedata() {
      // this.treedata = this.deviceList
      if (this.deviceList.length === 0) { return this.$message.warning("请先添加设备"); }
      this.$set(this.treedata, 0, {
        deviceName: "虚拟设备",
        children: []
      });
      this.$set(this.treedata, 1, {
        deviceName: "物联设备",
        children: []
      });
      this.deviceList.forEach(item => {
        if (item.type === "虚拟") {
          // this.treedata[0].children = []
          this.treedata[0].children.push(item);
          this.treedata[0].deviceName = "虚拟设备";
          this.treedata[0].deviceNo = this.treedata[0].children[0].deviceNo;
          this.treedata[0].disabled = true;
        } else if (item.type === "物理") {
          this.treedata[1].children.push(item);
          this.treedata[1].deviceName = "物联设备";
          this.treedata[1].disabled = true;
          this.treedata[1].deviceNo = this.treedata[1].children[0].deviceNo;
        }
      });
      // console.log(this.treedata)
      this.handleSelectionChange(this.treedata[0]);
    }
  }
};
</script>
